<!DOCTYPE html>
<html>

	<head>
		<meta charset="UTF-8">
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
		<title></title>
		<link rel="stylesheet" type="text/css" href="../../../common/js/bootstrap-3.3.7-dist/css/bootstrap.min.css" />
		<link rel="stylesheet" type="text/css" href="../../../common/js/bootstrap-3.3.7-dist/css/bootstrap-datatimepicker.4.14.47.min.css" />

		<link rel="stylesheet" type="text/css" href="../../css/footer.css" />
		<link rel="stylesheet" type="text/css" href="../../css/swiper-3.4.2.min.css" />
		<link rel="stylesheet" type="text/css" href="css/manager.css" />

		<script src="../../../common/js/jquery-2.2.3.min.js" type="text/javascript" charset="utf-8"></script>
		<script ssrc="../../../common/js/bootstrap-3.3.7-dist/js/bootstrap.min.js" type="text/javascript" charset="utf-8"></script>
		<script src="../../../common/js/bootstrap-3.3.7-dist/js/moment-with-locales.min.js" type="text/javascript" charset="utf-8"></script>
		<script src="../../../common/js/bootstrap-3.3.7-dist/js/bootstrap-datatimepicker.4.14.47.js" type="text/javascript" charset="utf-8"></script>

		<!--画图插件-->
		<script src="../../js/Chart.addTest.js" type="text/javascript" charset="utf-8"></script>
		<script src="../../js/flexible.min.js" type="text/javascript" charset="utf-8"></script>
		<style>
			.Integral_rankimg-p {
				margin: 10px 0;
				display: inline-table;
				width: 100%;
			}
			
			.u2591_input {
				width: 4rem;
				height: 28px;
				border: 1px solid #ccc;
				border-radius: 5px;
				margin-left: 4%;
			}
		</style>
	</head>

	<body>
		<div id="wrap">
			<div id="main">
				<div id="header">
					<a id="headImg" href="javascript:history.go(-1)"><img class="headImg" src="../../images/12.png" /></a>
					<p id="headTitle" style="font-size: 16px;">积分排名</p>
				</div>
				<div id="content" style="padding-top: 1.3rem; font-size: 0.38rem; padding-bottom: 1.4rem; ">
					<div class="Integral_rankimg-p">
						<div class="time-box" style="width:3rem;text-align: center; float: left;margin-left: .4rem;">
							<div class="f30 jifenType jifen-time">
								<div class="form-group" style="float: left;height: 0.416666rem; margin-left: 5%;">
									<div class="input-group date" id='date1' style="height: 0.555555rem;">
										<select name="" id="time" style="height: 31px;border-radius:4px;" class="form-control">
											<option value="">时间</option>
										</select>
									</div>
								</div>
							</div>
						</div>
						<div style="text-align: center; display: none;">
							<canvas id="canvas" height="175" width="175"></canvas>
						</div>
						<select class="form-control" id="bumen" style="padding-left: 10px;width: 3rem;height: 31px;float: left;">
							<option selected="" value="">部门</option>
							<option value="总经办">总经办</option>
							<option value="综合办">综合办</option>
							<option value="技术部">技术部</option>
							<option value="策划部">策划部</option>
							<option value="市场部">市场部</option>
							<option value="客服部">客服部</option>
						</select>
						<select class="form-control" id="zhiwei" style="padding-left: 10px;width: 3rem;height: 31px;">
							<option selected="" value="">全职务</option>
							<option value="董事长">董事长</option>
							<option value="财务出纳">财务出纳</option>
							<option value="行政经理">行政经理</option>
							<option value="财务经理">财务经理</option>
							<option value="产品经理">产品经理</option>
							<option value="文案策划">文案策划</option>
							<option value="平面策划">平面策划</option>
							<option value="渠道总监">渠道总监</option>
							<option value="市场部经理">市场部经理</option>
							<option value="培训讲师">培训讲师</option>
							<option value="网络推广">网络推广</option>
						</select>
					</div>
					<table style="width: 100%;text-align: center; font-size: 0.38rem;" class="table table-bordered">
						<tr style="font-weight: bold; background: #fff;font-size: 0.38rem;">
							<td>排名</td>
							<td>姓名</td>
							<td>&nbsp;&nbsp;部门&nbsp;&nbsp;</td>
							<td>职位</td>
							<td>积分数</td>
						</tr>
						<tr class="jifen1" data-time="2017.10.04">
							<td>1</td>
							<td>孙泽慧</td>
							<td>总经办</td>
							<td>董事长</td>
							<td>11122</td>
						</tr>
						<tr class="jifen1" data-time="2017.10.04">
							<td>2</td>
							<td>赵立虹</td>
							<td>综合办</td>
							<td>财务出纳</td>
							<td>3123</td>
						</tr>
						<tr class="jifen1" data-time="2017.11.04">
							<td>3</td>
							<td>谭善明</td>
							<td>技术部</td>
							<td>产品经理</td>
							<td>3010</td>
						</tr>
						<tr class="jifen1" data-time="2017.12.04">
							<td>4</td>
							<td>王元博</td>
							<td>综合办</td>
							<td>行政经理</td>
							<td>2800</td>
						</tr>
						<tr class="jifen1" data-time="2017.12.04">
							<td>5</td>
							<td>张立杰</td>
							<td>综合办</td>
							<td>财务经理</td>
							<td>2400</td>
						</tr>
						<tr class="jifen1" data-time="2017.12.04">
							<td>6</td>
							<td>杨晓宇</td>
							<td>策划部</td>
							<td>文案策划</td>
							<td>2100</td>
						</tr>

						<tr class="jifen1" data-time="2017.12.04">
							<td>7</td>
							<td>王东明</td>
							<td>综合办</td>
							<td>财务经理</td>
							<td>2000</td>
						</tr>
						<tr class="jifen1" data-time="2017.12.04">
							<td>8</td>
							<td>刘小正</td>
							<td>策划部</td>
							<td>平面策划</td>
							<td>1950</td>
						</tr>
						<tr class="jifen1" data-time="2017.12.04">
							<td>9</td>
							<td>闫峰</td>
							<td>市场部</td>
							<td>渠道总监</td>
							<td>1850</td>
						</tr>
						<tr class="jifen1" data-time="2017.12.04">
							<td>10</td>
							<td>国鑫</td>
							<td>市场部</td>
							<td>经理</td>
							<td>1550</td>
						</tr>
						<tr class="jifen1" data-time="2017.12.04">
							<td>11</td>
							<td>张金艳</td>
							<td>市场部</td>
							<td>培训讲师</td>
							<td>1200</td>
						</tr>
						<tr class="jifen1" data-time="2017.12.04">
							<td>12</td>
							<td>孟昱辰</td>
							<td>客服部</td>
							<td>客服</td>
							<td>1000</td>
						</tr>
						<tr class="jifen1" data-time="2017.12.04">
							<td>13</td>
							<td>马忠阳</td>
							<td>市场部</td>
							<td>网络推广</td>
							<td>980</td>
						</tr>
					</table>
				</div>

			</div>
			<div id="foot" class="row">
				<a class="foot col-xs-3 col-sm-3" href="../kaoqin/index2.html">
					<img class="footImg" src="../../images/guanlixuanzhong.png" />
					<p>管理</p>
				</a>
				<a class="foot col-xs-3 col-sm-3" href="../coalition/colalition.html">
					<img class="footImg" src="../../images/lianmengchushi.png" />
					<p>联盟</p>
				</a>
				<a class="foot col-xs-3 col-sm-3" href="../store/store.html">
					<img class="footImg" src="../../images/11.png" />
					<p>商城</p>
				</a>
				<a class="foot col-xs-3 col-sm-3" href="../personage/personIndex.html">
					<img class="footImg" src="../../images/13.png" />
					<p>我的</p>
				</a>
			</div>
		</div>

	</body>
	<script src="../../js/handlebars-v2.0.0.js" type="text/javascript" charset="utf-8"></script>
	<script src="../../js/rhAdmin.js" type="text/javascript" charset="utf-8"></script>
	<!--<script src="../../../js/bootstrap-3.3.7-dist/js/bootstrap.min.js" type="text/javascript" charset="utf-8"></script>-->
	<!--<script src="../../../js/handlebars-v2.0.0.js" type="text/javascript" charset="utf-8"></script>-->
	<script src="js/record_write.js" type="text/javascript" charset="utf-8"></script>

	<script src="../../js/rhAdmin.js" type="text/javascript" charset="utf-8"></script>
	<script src="../../js/Chart.addTest.js" type="text/javascript" charset="utf-8"></script>
	<script src="../../../common/js/bootstrap-3.3.7-dist/js/moment-with-locales.min.js" type="text/javascript" charset="utf-8"></script>
	<script src="../../../common/js/bootstrap-3.3.7-dist/js/bootstrap-datatimepicker.4.14.47.js" type="text/javascript" charset="utf-8"></script>

	<script type="text/javascript">
		$(function() {
			var pieData = [{
					value: 111,
					color: "#ad6f6d",
					text: "33.3%"
				}, {
					value: 111,
					color: "#6eaead",
					text: "33.3%"
				}, {
					value: 111,
					color: "#706fac",
					text: "33.3%"
				}

			];

			var canvas = document.getElementById("canvas");
			var myPie = new Chart(canvas.getContext("2d")).Pie(pieData);

			//http://eonasdan.github.io/bootstrap-datetimepicker/Options/#widgetpositioning  参数详解-->
			//		    $('#date1').datetimepicker({  
			//		        format: 'YYYY-MM-DD ',  
			//		        locale: moment.locale('zh-cn'),
			//		        showTodayButton:true,
			//		        showClose:true,
			//		        minDate:'2017-10-01',
			//		        maxDate:'2018-10-31',
			//		        date:'2017-10-25',
			//		        widgetPositioning:{
			//		        	horizontal: 'left',
			//          		vertical: 'bottom'
			//		        }
			//		    });
			//		     $('#date2').datetimepicker({  
			//		        format: 'YYYY-MM-DD ',  
			//		        locale: moment.locale('zh-cn'),
			//		        showTodayButton:true,
			//		        showClose:true,
			//		        minDate:'2017-10-01',
			//		        maxDate:'2018-10-31',
			//		        date:'2017-10-25',
			//		        widgetPositioning:{
			//		        	horizontal: 'right',
			//          		vertical: 'bottom'
			//		        }
			//		    });
			var date = new Date(); // new 一个Date对象
			var year = date.getFullYear(); // 年份
			var month = date.getMonth() + 1; // 月份（从0开始，所以应+1）
			var a;
			console.log(year);
			for(var i = month; i > month - 12; i--) {

				if(i == 0) {
					a = 12;
					year -= 1
				} else {
					a = i;
				}
				$('<option value="' + year + '.' + a + '">' + year + "年" + a + "月" + "</option>").appendTo($("#time")); // 依次添加下拉框选项，value自定义，右边的appendTo参数为目标选择框
			}

			function isContains(str, substr) {
				return new RegExp(substr).test(str);
			}

			function searchName() {
				$(".jifen1").hide();
				$.each($(".jifen1"), function(idx, item) {
					if(idx != 0) {
						//					$("#list_add li:nth-child(1)").show();
						if(item.children[0]) {
							if(isContains(item.children[1].innerHTML, $("#searchName").val())) {
								$(this).show();
							}
						}

					}
				});
				if($("#searchName").val() == '') {
					//插入字母
					charuZimu();
				}
				$('#bumen').val('')
				$('#zhiwei').val('')
			}

			function searchBumen() {
				$(".jifen1").hide();

				$.each($(".jifen1"), function(idx, item) {
					var aaa = $('.jifen1').eq(idx).attr('data-time');
					//				if(idx != 0) {
					//					$(".jifen1:nth-child(1)").show();
					//					console.log(item.children[1])
					if(item.children[0]) {
						if(isContains(aaa, $('#time').val()) && isContains(item.children[2].innerHTML, $('#bumen').val()) && isContains(item.children[3].innerHTML, $('#zhiwei').val())) {
							$(this).show();
						}
					}

					//				}
				});
			}

			function search() {
				$(".jifen1").hide();
				$.each($(".jifen1"), function(idx, item) {
					console.log(item)
					var aaa = $('.jifen1').eq(idx).attr('data-time');
					//				if(idx != 0) {
					//					$(".jifen1:nth-child(1)").show();
					if(item.children[0]) {
						if(isContains(aaa, $('#time').val()) && isContains(item.children[2].innerHTML, $('#bumen').val()) && isContains(item.children[3].innerHTML, $('#zhiwei').val())) {
							$(this).show();
						}
					}

					//				}
				});
			}
			$('#bumen').on('change', function() {
				searchBumen();
				$('#searchName').val('');
				if($('#bumen').val() == '' && $('#zhiwei').val() == ''&&$('#time').val()=='') {
					//				searchName();
					$('.jifen1').show();
				}
			})
			$('#time').on('change', function() {
				search()
			})
			$('#zhiwei').on('change', function() {
					searchBumen();
					$('#searchName').val('');
					if($('#zhiwei').val() == '' && $('#bumen').val() == ''== ''&&$('#time').val()=='') {
						//				searchName();
						$('.jifen1').show();
					}
				})
				//			$.ajax({
				//				type: "get",
				//				url: "http://47.104.13.109/mall-service/areapic/search",
				//				async: true,
				//				data: {
				//					"areaId": "1"
				//				},
				//				success: function(data) {
				//					console.log(data);
				//					$('.tabDiv li:nth-child(1) img').attr("src", data.pic1);
				//				}
				//			});

		})
	</script>

</html>